<template>
	<view>

		<uni-list :border="true">
			<!-- 头像显示圆点 -->
			<uni-list-chat v-for="item in list" :title="item.title" avatar="/static/message1" note="" showBadge
				:time="item.time" :showBadge="false" badge-positon="left" :badge-text="item.read==0?'dot':''"
				:to="'/pages/index/mesdetail/mesdetail?id='+item.id"></uni-list-chat>
		</uni-list>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				queryParam: {
					uid: getApp().globalData.shop.id,
					pageNum: 1,
					pageSize: 10,
				},
				list: [],
				total: 0,
				value: 0,
				requestFlag: false,
			}
		},
		methods: {
			//查看公告
			// open1(index) {
			// 	console.log(11);
			// },
			//获取通知
			getList() {
				if (this.requestFlag) {
					return;
				}
				this.requestFlag = true;
				uni.request({
					url: 'http://localhost:7000/user/message/list?vestIn=0',
					data: this.queryParam,
					method: 'GET',
					header: {
						authorization: getApp().globalData.token
					},
					success: (resp) => {
						if (resp.data.code == 200) {
							console.log(resp.data.rows);
							this.list = [...this.list, ...resp.data.rows];
							this.total = resp.data.total;
							this.requestFlag = false;
						} else {
							uni.showToast({
								title: '服务器繁忙',
								icon: 'none'
							})
						}
					},
					fail: (resp) => {}
				})
			},
		},
		onLoad() {
			const ws = new WebSocket('ws://127.0.0.1:7000/business/websocket/message/' + getApp().globalData.shop.id);
			ws.onopen = () => {
				console.log('WebSocket 连接已打开');
			};
			ws.onmessage = (event) => {
				console.log(22);
				this.queryParam.pageNum = 1;
				this.queryParam.pageSize = 10;
				this.list = [];
				this.getList();
				// 处理接收到的消息
			};
			ws.onerror = (error) => {
				console.error('WebSocket 错误：', error);
			};
			ws.onclose = () => {
				console.log('WebSocket 连接已关闭');
			};
		},
		onShow() {
			this.queryParam.pageNum = 1;
			this.queryParam.pageSize = 10;
			this.list = [];
			this.getList();
		},
		onReachBottom() {
			console.log(this.requestFlag);
			if (this.requestFlag) {
				return;
			}
			if (this.queryParam.pageNum * 10 >= this.total) {
				uni.showToast({
					title: '没有更多数据了',
					icon: "none"
				});
				return;
			}
			this.queryParam.pageNum = this.queryParam.pageNum + 1;
			this.getList();
			uni.showToast({
				title: '正在加载中....',
				icon: "none"
			})
		}
	}
</script>

<style>
	.slot-box {
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
		align-items: center;
	}

	.slot-image {
		/* #ifndef APP-NVUE */
		display: block;
		/* #endif */
		margin-right: 10px;
		width: 30px;
		height: 30px;
	}

	.slot-text {
		flex: 1;
		font-size: 14px;
		color: #4cd964;
		margin-right: 10px;
	}

	.uni-list-item {
		height: 200rpx;
	}
</style>